﻿@model App.Web.ViewModels.RegisterViewModel
@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>注册 或 找回密码！</title>
    <link href="//cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <link href="//cdn.bootcss.com/animate.css/3.5.2/animate.min.css" rel="stylesheet" type="text/css" />
    <link href="~/Content/css/app.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="~/assets/plugins/sweetalert/sweetalert.css">
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body class="hold-transition login-page">
    <div class="login-box">
        <div class="login-logo">
            <a href="/">@GetConfig("system.appname")</a>
        </div>
        <!-- /.login-logo -->
        <div class="login-box-body">
            <p class="login-box-msg">在这里注册帐户或重置您的登录密码。</p>

            @using (Html.BeginForm())
            {
                @Html.AntiForgeryToken()
                @Html.ValidationSummary(true)
                <div class="form-group has-feedback">
                    @Html.TextBoxFor(m => m.Mobile, new { @class = "form-control uname", @placeholder = "手机号", @required = "" })
                    @Html.ValidationMessageFor(m => m.Mobile)
                    <span class="glyphicon glyphicon-envelope form-control-feedback"></span>
                </div>
                <div class="form-group has-feedback">
                    @Html.TextBoxFor(m => m.MobileCode, new { @class = "form-control pword", @placeholder = "验证码", @required = "" })
                    @Html.ValidationMessageFor(m => m.MobileCode)
                    <span class="glyphicon glyphicon-lock form-control-feedback"></span>
                </div>
                <div class="row">
                    <div class="col-xs-8">
                        <button id="btnSendMobileCode" type="button" class="btn btn-default">点击获取</button>
                    </div>
                    <!-- /.col -->
                    <div class="col-xs-4">
                        <button class="btn btn-primary btn-block btn-flat" type="submit">确 认</button>
                    </div>
                    <!-- /.col -->
                </div>
            }
            <br />
            <a href="/account/login">返回登录</a><br>

        </div>
        <!-- /.login-box-body -->
    </div>
    <!-- /.login-box -->
    <!-- jQuery 2.2.3 -->
    <script src="/scripts/jquery-2.1.4.min.js"></script>
    <!-- Bootstrap 3.3.6 -->
    <script src="/scripts/bootstrap.min.js"></script>
    <script src="~/assets/plugins/sweetalert/sweetalert.min.js"></script>
    <script src="~/assets/js/custom.js"></script>
    <script>
      $(function () {
        var btn = $('#btnSendMobileCode');
        btn.click(function () {
            var mobile = $('#Mobile').val();
            if (!checkMobile(mobile)) {
                sweetAlert("手机号格式错误!", "", "error");
                return;
            }

            btn.prop('disabled', true);
            $.post('/common/SendMobileCode', { mobile: mobile }, function (data) {
                if (data.success) {
                    sweetAlert("验证码已经发送到您的手机!", "", "success");
                    var i = 60;
                    var s = setInterval(function () {
                        btn.text(i + '秒后重新发送');
                        i--;
                        if (i == 0) {
                            clearInterval(s);
                            btn.text('点击获取').prop('disabled', false)
                        }
                    }, 1000);
                }
                else {
                    sweetAlert(data.message, "", "error");
                }
            });
        });
      });
    </script>
</body>
</html>


